<template>
  <div class="backend-detail">
    <div class="detail-info">
      <el-card class="box-card">
        <template #header>
          <div class="card-header">
            <span>宣讲订单评价详情</span>
            <el-button type="primary" @click="goList">返回列表</el-button>
          </div>
        </template>

        <div v-loading="loading">
          <el-row class="detail-item">
            <el-col :span="3" class="detail-label">课程名称：</el-col>
            <el-col :span="21">{{ evaluateDetail.courseName }}</el-col>
          </el-row>

          <el-row class="detail-item">
            <el-col :span="3" class="detail-label">评价人：</el-col>
            <el-col :span="21">{{ evaluateDetail.createUserName }}</el-col>
          </el-row>

          <el-row class="detail-item">
            <el-col :span="3" class="detail-label">评价项：</el-col>
            <el-col :span="21">{{ evaluateDetail.questions }}</el-col>
          </el-row>

          <el-row class="detail-item">
            <el-col :span="3" class="detail-label">打分：</el-col>
            <el-col :span="21">{{ evaluateDetail.mark }}</el-col>
          </el-row>

          <el-row class="detail-item">
            <el-col :span="3" class="detail-label">评价内容：</el-col>
            <el-col :span="21">{{ evaluateDetail.content }}</el-col>
          </el-row>

          <el-row class="detail-item">
            <el-col :span="3" class="detail-label">审核状态：</el-col>
            <el-col :span="21">{{ evaluateDetail.checkStatus == 0 ? '未审核' : evaluateDetail.checkStatus == 1 ? '审核通过' : evaluateDetail.checkStatus == -1 ? '审核未通过' : '' }}</el-col>
          </el-row>
          
        </div>
      </el-card>
    </div>
  </div>
  
</template>

<script>
export default { name: 'backendPublicizeEvaluateDetail' }
</script>

<script setup>
import { ref, reactive, onMounted } from 'vue';
import { useRouter } from 'vue-router'
import { More } from "@element-plus/icons-vue";
import { ElMessage, ElMessageBox } from 'element-plus'
import tEditor from "@/components/tinymceEditor/tEditor.vue"
import { http } from '@/utils/http/index';
import { format } from '@/plugins/moment.js'
import { checkStatusFieldFormat } from "@/utils/backend.js"

/* 路由 */
const route = useRouter()

onMounted(() => {
  getEvaluateDetail()
})

/* 详情数据加载动画 */
const loading = ref(false)

/* 详情内容 */
const evaluateDetail = ref({})

/* 获取详情内容 */
const getEvaluateDetail = () => {
  loading.value = true
  http.$GET("/PreachM/GetPreachEvaluateDetailById", { Id: route.currentRoute.value.query.id }).then(res => {
    loading.value = false
    if (res.isError) return
    if(!res.result) return
    evaluateDetail.value = res.result
  }).catch(err => {
    loading.value = false
    ElMessage.warning("查询失败")
  })
}

/* 返回列表 */
const goList = () => {
  route.push({
    path: "/backend/publicize-evaluate",
    query: route.currentRoute.value.query.currentPage ? { currentPage: route.currentRoute.value.query.currentPage } : {}
  })
}
</script>

<style lang='scss' scoped>
@import "@/assets/styles/backendElement.scss";
:deep(.detail-info){
  width: 100% !important;
}
</style>